function EagleEyeLayer(viewer, width, height) {
	this.width = width
	this.height = height
	this.viewer = viewer
	this.show = function() {
		console.log(this.viewer)
		if (this.divOwner) {
			return
		}
		this.divOwner = this.createElement()
		this.viewer.canvas.parentElement.appendChild(this.divOwner)
	}
	this.close = function() {
		if (this.divOwner) {
			this.divOwner.remove()
			this.viewer.camera.changed.removeEventListener(this.event)
			this.divOwner = null
		}
	}
	this.isMoved = false
	this.createElement = function() {
		let divOwner = document.createElement('div')
		divOwner.style.border = 'solid 2px #2592FC'
		divOwner.style.width = this.width + '.px'
		divOwner.style.height = this.height + '.px'
		// let img = GV.Util.formatUrlByBaseJs('images/baseMapImg/globe.jpg')
		// divOwner.style.backgroundImage = "url('" + img + "')";
		divOwner.style.backgroundImage = "url('" + 'images/baseMapImg/globe.jpg' + "')"
		// divOwner.style.backgroundSize='100% 100%';
		divOwner.style.cssText += 'background-size: 100% 100%;position: absolute;bottom: 48px;right: 20rem;z-index:99999'
		let lon = document.createElement('div')
		lon.style.height = this.height + '.px'
		lon.style.cssText += ' width: 0px;border-left:1px solid white;position: absolute;'
		let lat = document.createElement('div')
		lat.style.cssText += 'height: 0px;border-top:1px solid white;position: absolute;'
		lat.style.width = this.width + '.px'
		divOwner.appendChild(lon)
		divOwner.appendChild(lat)
		let changeDiv = () => {
			if (!this.isMoved) {
				let position = this.viewer.camera.positionCartographic

				let longNum = Number(Cesium.Math.toDegrees(position.longitude))
				let latNum = Number(Cesium.Math.toDegrees(position.latitude))
				let cLeft = this.calcLeft(longNum)
				let centerBottom = this.calcBottom(latNum)

				let top = this.height - Number.parseFloat(centerBottom.substr(0, centerBottom.indexOf('p')))
				let left = Number(cLeft.substr(0, cLeft.indexOf('p'))) - this.width / 2
				let latTop = top + 'px'
				let longLeft = cLeft
				lon.style.marginLeft = longLeft
				lat.style.marginTop = latTop
			}
		}
		this.event = (event) => {
			changeDiv()
		}
		this.viewer.camera.changed.addEventListener(this.event)
		divOwner.addEventListener('click', (event) => {
			this.isMoved = true
			let box = divOwner.getBoundingClientRect()
			let height = this.viewer.camera.positionCartographic.height
			let x = event.clientX - box.left
			let y = event.clientY - box.top
			let lon = (x / this.width) * 360 - 180
			let lat = -((y / this.height) * 180 - 90)
			this.viewer.camera.setView({
				destination: Cesium.Cartesian3.fromDegrees(lon, lat, height),
			})
			this.isMoved = false
		})
		changeDiv()
		return divOwner
	}
	this.calcLeft = function(longitude) {
		longitude = longitude + 180
		let leftNum = (longitude / 360) * this.width
		return leftNum + 'px'
	}
	this.calcBottom = function(latitude) {
		latitude = latitude + 90
		let bottomNum = (latitude / 180) * this.height
		return bottomNum + 'px'
	}
}
export { EagleEyeLayer }
